import portLayoutViews from "./portLayoutViews.js"
import {markRaw} from 'vue';
import UrlView from "./UrlView.vue";
import AppUtil from "@/assets/js/AppUtil";


export default {
    data() {
        return {
            currentView: {template: "<div>"+this.i18n('loadingData','正在加载数据')+"</div>"},
        }
    },
    methods:{
        /**
         * 国际化
         */
        i18n(name,text,key){
            return this.$ti18(name,text,"portalApi",key);
        },
        load(){
            if(!this.insColumnDef){
                return ;
            }
            //vue组件
            if(this.insColumnDef.typeName=='VueBel'){

                let setTingJson = JSON.parse(this.insColumnDef.setTing);
                let component=setTingJson.component;
                let vueType=setTingJson.vueType;
                if(vueType=="url"){
                    this.loadVueUrl(component);
                }else if(component){
                    this.loadVueColumn(component);
                }
            }else {
                this.loadScript();
                this.loadLink();
                this.currentView = markRaw({
                    mixins: [portLayoutViews],
                    template: this.insColumnDef.templet
                })
                let self=this;
                this.$nextTick(function () {
                    self.formVm = self.$refs.component;
                    self.formVm.insColumnDef = self.insColumnDef;
                    self.formVm.colId = self.insColumnDef.colId;
                    self.formVm.loadColumn();
                });
            }
            return this.formVm;
        },
        /**
         * 加载外部URL
         * @param {String} url 一个http地址
         */
        loadVueUrl(url) {
            this.currentView =  markRaw(UrlView);
            this.$nextTick(function () {
                //获取UrlView实例
                this.formVm = this.$refs.component;
                this.formVm.url = url;
            });
        },
        /**
         * 根据vue 路径加载vue组件
         * @param  {String} component vue组件路径
         */
        loadVueColumn(component) {
            try {
                this.currentView = AppUtil.loadComponent(component);
            }
            catch(err) {
                this.$bus.$emit('loadVueColumn',component,this);
            }
        },

        setCurrentView(view) {
            this.$nextTick(function () {
                this.currentView=view;
            });
        },
        // 加载栏目模板的中的脚本
        loadScript(){
            let template=this.insColumnDef.templet;
            let scriptMath = template.match(/<script id=".*" src=".*"><\/script>/g);
            if(scriptMath==null){
                return;
            }
            for(let i=0;i<scriptMath.length;i++){
                let script = scriptMath[i].match(/<script id="([\s\S]*)" src="([\s\S]*)"><\/script>/);
                if(script){
                    let id=script[1];
                    let newScript=document.getElementById(id);
                    if(!newScript){
                        newScript=document.createElement('script');
                        document.getElementsByTagName('head')[0].appendChild(newScript)
                    }
                    newScript.id=id;
                    newScript.type="text/javascript";
                    newScript.src=script[2];
                    this.insColumnDef.templet=template.replace(script[0],"");
                }
            }
        },
        // 加载模板中的样式。
        loadLink(){
            let template=this.insColumnDef.templet;
            let linkMath = template.match(/<link id=".*" href=".*" \/>/g);
            if(linkMath==null){
                return;
            }
            for(let i=0;i<linkMath.length;i++){
                let link = linkMath[i].match(/<link id="([\s\S]*)" href="([\s\S]*)" \/>/);
                if(link){
                    let id=link[1];
                    let newLink=document.getElementById(id);
                    if(!newLink){
                        newLink=document.createElement('link');
                        document.getElementsByTagName('head')[0].appendChild(newLink)
                    }
                    newLink.id=id;
                    newLink.rel="stylesheet";
                    newLink.type="text/css";
                    newLink.href=link[2];
                    this.insColumnDef.templet=template.replace(link[0],"");
                }
            }
        }
    }
}
